<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
  Created by IntelliJ IDEA.
  User: Tian
  Date: 2024/3/7
  Time: 16:06
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>修改信息页面</title>
    <script src="js/jquery-3.6.3.min.js"></script>
    <style>
        img{
            width: 80px;
            height: 80px;;
            border-radius: 50%;
        }
    </style>
</head>
<body>
<script>
    $(()=>{
        let file=$("form input[name='myfile']")
        $("form img").click(()=>{
            console.log("点击事件发生了")

           /* file.change(()=>{
                console.log("图片改变了")
                alert(file.val())//获得的路径是一个假的路径,因为浏览器具有保护机制
            })*/
            file.click()
            file.change(function () {
                let oFReader = new FileReader();
                let file1 = document.getElementById('file').files[0];

                oFReader.readAsDataURL(file1);
                oFReader.onloadend = function(oFRevent){
                    let src = oFRevent.target.result;
                    $('form img').attr('src',src);

                }

            })
        })



    })
</script>

<form action="/update" method="post" enctype="multipart/form-data">
    <input type="file" name="myfile" id="file" hidden><br>
    用户头像:<img src="${requestScope.u.head}"><br>
    用户id:<input type="text" readonly  name="id" value=${requestScope.u.id}><br>
    用户账号:<input type="text" name="name" value=${requestScope.u.name}><br>
    用户密码:<input type="text" name="password" value=${requestScope.u.password}><br>
    用户昵称:<input type="text" name="nick" value=${requestScope.u.nick}><br>

    用户性别:
    <c:choose>
            <c:when test="${requestScope.u.sex=='男'}">
                <input type="radio" name="sex" value="男" checked>男
                <input type="radio" name="sex" value="女">女
            </c:when>

            <c:when test="${requestScope.u.sex=='女'}">
                <input type="radio" name="sex" value="男">男
                <input type="radio" name="sex" value="女" checked>女
            </c:when>
    </c:choose>





    <input type="submit" value="保存">
</form>
</body>
</html>
